<%@ page import="activity.Event" %>
<!DOCTYPE html>
<html>
    <head>
        <meta name="layout" content="frontend">
        <script src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.13.0/jquery.validate.min.js"></script>
        <script src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.13.0/localization/messages_zh_TW.js"></script>
    </head>
    <body>
        <div class="row">
            <g:form action="dataSave">
                <div class="col-md-6">
                    <div class="panel panel-info">
                        <div class="panel-heading"><p class="text-center" style="font-size:40"><strong>${serial.name}</strong></p></div>
                        <ul class="list-group list-group-flush text-center">
                            <li class="list-group-item"><i class="icon-ok text-danger"></i>主辦單位：${serial.host}</li>
                            <li class="list-group-item"><i class="icon-ok text-danger"></i>承辦人：${serial.staff}</li>
                            <li class="list-group-item"><i class="icon-ok text-danger"></i>電話：${serial.tel}</li>
                            <li class="list-group-item"><i class="icon-ok text-danger"></i>Email：${serial.email}</li>
                        </ul>
                    </div><!--/panel-->
                    <g:each in="${events}" status="i" var="event">
                        <div id="detail${event.id}" name="detail" style="display:none" class="panel panel-info">
                            <div class="panel-body text-center">
                                <p style="font-size:40px"><strong>${event.name}</strong></p>
                            </div>
                            <ul class="list-group list-group-flush text-center">
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>時間：${formatDate(format:"MM/dd HH:mm",date:event.dateStart)} ~ ${formatDate(format:" HH:mm",date:event.dateEnd)}</li>
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>地點：${event.place}</li>
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>名額：${fieldValue(bean: event, field: "registerQty")}/${fieldValue(bean: event, field: "capacityQty")}/${fieldValue(bean: event, field: "standbyQty")}</li>
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>活動對象：${event.audience}</li>
                                <li class="list-group-item"><i class="icon-ok text-danger"></i>內容簡介：${event.intro}</li>
                                <g:if test="${event.files?.size() > 0}">
                                <li class="list-group-item"><i class="icon-ok text-danger"></i><g:link url="${createLinkTo(file:''+event.files)}">檔案下載</g:link></li>
                                    </g:if>
                            </ul>
                        </div><!--/panel-->
                    </g:each>
                </div><!--/col-->
                <div class="col-md-6">
                    <div class="panel panel-info">
                        <div class="panel-heading"><p class="text-center" style="font-size:40"><strong>報名成功</strong></p></div>
                        <ul class="list-group list-group-flush text-center">
                            <li class="list-group-item">
                            <table>
                                <thead>
                                    <tr>
                                        <th>場次名稱</th>
                                        <th>場次時間</th>
                                        <!--<th>詳細資訊</th>-->
                                    </tr>
                                </thead>
                                <tbody>
                                    <g:each in="${events}" status="i" var="eventInstance">
                                        <tr class="${(i % 2) == 0 ? 'even' : 'odd'}">
                                            <td>${fieldValue(bean: eventInstance, field: "name")}</td>
                                            <td>${formatDate(format:"MM/dd HH:mm",date:eventInstance.dateStart)} ~ ${formatDate(format:" HH:mm",date:eventInstance.dateEnd)}</td>
                                            <!--<td><a href="#" name="show" eventId="${eventInstance.id}">顯示</a></td>-->
                                        </tr>
                                    </g:each>
                                </tbody>
                            </table>                    
                            </li>
                            <g:if test="${cancelCode}">
                                <li class="list-group-item">
                                    <label>報名取消碼</label><div style="color:red">${cancelCode}</div>
                                    <div>此碼為取消報名之用，請妥善保管！</div>
                                </li>
                            </g:if>
                            <li class="list-group-item">
                                    <label>姓名</label>${reader.name}
                            </li>
                            <li class="list-group-item">
                                    <label>性別</label>${reader.gender}
                            </li>
                            <li class="list-group-item">
                                    <label>生日</label>${formatDate(format:"yyyy/M/d", date:reader.birth)}
                            </li>
                            <g:if test="${reader.CID}">
                                <li class="list-group-item">
                                        <label>身份證字號</label>${reader.CID}
                                </li>
                            </g:if>
                            <g:if test="${reader.service}">
                                <li class="list-group-item">
                                        <label>服務單位</label>${reader.service}
                                </li>
                            </g:if>
                            <g:if test="${reader.title}">
                                <li class="list-group-item">
                                        <label>職稱</label>${reader.title}
                                </li>
                            </g:if>
                            <g:if test="${reader.tel1}">
                                <li class="list-group-item">
                                        <label>主要聯絡電話</label>${reader.tel1}
                                </li>
                            </g:if>
                            <g:if test="${reader.tel2}">
                                <li class="list-group-item">
                                        <label>次要聯絡電話</label>${reader.tel2}
                                </li>
                            </g:if>
                            <g:if test="${reader.email1}">
                                <li class="list-group-item">
                                        <label>主要Email</label>${reader.email1}
                                </li>
                            </g:if>
                            <g:if test="${reader.email2}">
                                <li class="list-group-item">
                                        <label>次要Email</label>${reader.email2}
                                </li>
                            </g:if>
                            <g:if test="${reader.custom1}">
                                <li class="list-group-item">
                                    <label>${field.custom1Label}</label>${reader.custom1}
                                </li>
                            </g:if>
                            <g:if test="${reader.custom2}">
                                <li class="list-group-item">
                                        <label>${field.custom2Label}</label>${reader.custom2}
                                </li>
                            </g:if>
                            <g:link action="index" class="btn btn-lg btn-block btn-primary">繼續報名</g:link>
                            <g:link action="clear" class="btn btn-lg btn-block btn-warning">結束報名</g:link>

                        </ul>
                    </div><!--/panel-->

                </div><!--/col-->
            </g:form>
        </div><!--/row-->
    </body>
</html>